<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<head>
    <link rel="SHORTCUT ICON" href="favicon.ico">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" >
    <title>历史 | 品格图床 | 免登陆图床</title>
    <link rel="shortcut icon" href="favicon.ico">

    <!-- 新 Bootstrap4 核心 CSS 文件 -->
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/css/bootstrap.min.css">

    <script src="js/jquery.min.js"></script>
<!--    <script src="js/jquery.lazyload.js"></script>-->

    <!-- 最新的 Bootstrap4 核心 JavaScript 文件 -->
    <script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>

    <!-- axios插件 -->
    <script src="js/axios.min.js"></script>
    <script src="js/bs4.pop.js"></script>


    <link rel="stylesheet" href="css/history/style.css" >
    <link rel="stylesheet" href="css/bs4.pop.css" >
    <link rel="stylesheet" href="css/main.css" >
    <style>
        .navbar-brand > img {
            display: inline
        }

        img:not(.brand) {
            width: 600px;
            height: auto;
            max-height: 500px;
        }

        .container > p {
            font-size: 20px;
            text-align: center;
            color: white;
            line-height: 15px;
        }
        .notice {
            margin-top: 30px;
        }
    </style>
</head>
<body>
    <script>
        var width = document.body.clientWidth;
        $(function () {
            if (width <= 406) {
                $(".main").css("padding-left", "0px");
                $(".main").css("padding-right", "0px");
            }
        });
    </script>
    <nav class="navbar navbar-expand-lg navbar-light bg-light">
        <div class="container">
            <a class="navbar-brand" href="/"><img class="brand" src="favicon.ico" style="height: 25px">&nbsp;品格图床</a>

            <button id="toggler-navbar" class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar">
                <span class="navbar-toggler-icon"></span>
            </button>


            <div class="collapse navbar-collapse" id="collapsibleNavbar">
                <ul class="navbar-nav">
                    <li class="nav-item"><a class="nav-link" href="/">上传</a></li>
                    <li class="nav-item active"><a class="nav-link" href="/history">历史</a></li>
                    <li class="nav-item"><a class="nav-link" href="/admin">管理</a></li>
                </ul>
            </div>
        </div>
    </nav>
    <script>
        bs4pop.notice("由于文件大小原因，历史界面可能会加载较慢，请您稍作等待", {position: "bottomright", type: "secondary"});
    </script>
    <div class="container main">
        <p class="notice">历史记录根据您的IP地址生成，请及时保存</p>
        <p class="ip"></p>
        <p class="count"></p>
        <section class="grid-wrap">
            <ul class="grid swipe-down" id="grid">
            </ul>
        </section>
    </div>

    <script src="js/history/func.js"></script>
    <script type="text/javascript" src="js/history/modernizr.js"></script>
</body>
</html>